<div ng-controller="SockjsStompCtrl">

    <section id="widget-grid" class="">

        <!-- row -->

        <div class="row">

            <article class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
                <!-- new widget -->
                <div class="jarviswidget jarviswidget-color-blueDark" id="wid-id-3" data-widget-colorbutton="false">

                    <header>
                        <span class="widget-icon"> <i class="fa fa-calendar"></i> </span>
                        <h2> 发送消息 </h2>
                        <div class="widget-toolbar">
                            <!-- add: non-hidden - to disable auto hide -->
                            <div class="btn-group">

                            </div>
                        </div>
                    </header>

                    <!-- widget div-->
                    <div>
                        <!-- widget edit box -->

                        <!-- end widget edit box -->

                        <div class="widget-body no-padding">
                            <!-- content goes here -->

                            <div>
                                <div id="connect-container">
                                    <ul>
                                        <li ng-repeat="item in echoList">{{$index}}. {{item.content}}</li>
                                    </ul>
                                    <div>
                                        <textarea id="message" ng-model="echo" style="width: 350px">Here is a message!</textarea>
                                    </div>
                                    <div>
                                        <button ng-click="sendEcho();">Echo message</button>
                                        <button ng-click="joinRoom();">Join Room</button>
                                    </div>
                                </div>
                                <div id="console-container">
                                    <div id="console"></div>
                                </div>
                            </div>

                            <!-- end content -->
                        </div>

                    </div>
                    <!-- end widget div -->
                </div>
                <!-- end widget -->
            </article>

        </div>

        <!-- end row -->

    </section>
</div>